<template>
    <el-dialog :model-value="props.visible" title="包装件入库" width="30%"  @close="handleClose">
        <el-form ref="formRef" :model="formData" label-width="auto">
            <el-form-item label="产品名称">
                {{ props.orderDetails.packingName }}
            </el-form-item>
            <el-form-item label="生产数量">
                {{ props.orderDetails.produceNumber }}
            </el-form-item>
            <el-form-item label="已入库数量">
                {{ props.orderDetails.inNumber || 0 }}
            </el-form-item>
            <el-form-item label="本次入库数量" prop="number">
                <el-input style="width: 60%" type="number" v-model.number="formData.number"></el-input>
            </el-form-item>
            <el-form-item prop="overFlag">
                <el-checkbox  v-model="formData.overFlag" :true-label="'1'" :false-label="'0'" label="该工序结束"></el-checkbox>
            </el-form-item>
        </el-form>
        <template #footer>
            <div class="dialog-footer">
                <el-button type="primary" @click="handleSubmit" >确定</el-button>
                <el-button @click="handleClose" >取消</el-button>
            </div>
        </template>
    </el-dialog>
</template>

<script setup lang="ts">
import { type FormInstance } from 'element-plus';
import { packageOrderInStorageApi } from '@/api/sj/productManagement/packageOrder';

const props = defineProps<{
    visible: boolean,
    orderDetails: any
}>();
const emits = defineEmits(['close','submit']);
const formRef = ref<FormInstance>();
const formData = ref({
    number: undefined,
    overFlag: '0'
});

const handleSubmit = async () => {
    const submitData = {
        ...formData.value,
        id: props.orderDetails.id
    };
    const { code } = await packageOrderInStorageApi(submitData);
    if(code == 200){
        emits('submit', true);
    }else{
        emits('submit', false);
    }
};

const handleClose = () => {
    formRef.value?.resetFields();
    emits('close');
};
</script>

<style scoped>

</style>